<template>
  <div class="staff">
    <el-card shadow="never" style="margin-bottom: 20px; border: none;">
      <SearchInfo :search="search" @searchClick="searchClick" @changeUser="changeUser"
       @changePass="changePass" @resetSearchInfo="resetSearchInfo"/>
    </el-card>
    <el-card shadow="never" style="border: none;">
      <table-list :tableData="tableData" @handleEdit="handleEdit" />
      <Pagination class="page-ination" v-if="meta.total" :total="meta.total" :limit="meta.per_page" @pagination="pagination" />
    </el-card>
  </div>
</template>
<script>
import TableList from './staffviews/TableList.vue';
import SearchInfo from './staffviews/SearchInfo.vue';
import Pagination from "@/components/Pagination";
import { getCourseExamRecordList } from '@/api/examination'
import { getAllUser } from '@/api/personnel'
export default {
  components: {
      TableList,
      SearchInfo,
      Pagination
  },
  data() {
      return {
          search: {
              // title: '',
              // status: 1,
              // paginate: null,
              // page: 1,
              course_name: '',
              paper_name: ''
          },
          tableData: [],
          arr: [],
          meta: {},
          paper: []
      }
  },
  created() {
      this.searchClick()
      this.getEmployessList()
  },
  methods: {
    // 获取所有考完的数据
    async searchClick() {
      try {
        const res = await getCourseExamRecordList(this.search)
        this.tableData = res.data
        console.log(this.tableData, 111111111)
        this.meta = res.meta
      } catch (err) {
        console.log(err)
      }
    },
      // 获取试卷详情
      async handleEdit(data) {
          console.log(data);
          this.$router.push({
              path: `/examination/detail/${data.id}`
          })
      },
      // 分页
      pagination(page) {
          this.search.page = page.page;
          this.search.paginate = page.limit;
          this.searchClick();
      },
      async getEmployessList() {
          try {
              const res = await getAllUser({
                  job_status: 1,
                  type: 2
              })
              this.options = res.data.map(item => {
                  return {
                      label: item.username,
                      value: item.id
                  }
              })
          } catch (error) {
              this.$message.error('获取员工信息失败')
              console.log('error ------>', error)
          }
      },
      handleFilterMethods() {
          this.getEmployessList()
      },
      changeUser(value){
          this.search.user_id=value
      },
      changePass(value){
          this.search.is_pass=value
      },
      resetSearchInfo(){
          this.search.page = this.$options.data().page
          this.search.course_name = this.$options.data().search.course_name
          this.search.paper_name = this.$options.data().search.paper_name
          this.searchClick()
      }
  }
}
</script>
<style lang="scss" scoped>
.staff {
  // margin: 30px;
  padding: 20px;
}
.page-ination {
  display: flex;
  justify-content: flex-end;
}
</style>